<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>学生成绩管理系统</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="student.css">
</head>
<body>
<div class="layout">
  <!-- 侧边栏 -->
  <nav class="sidebar">
    <div class="sidebar-title">学生成绩管理系统</div>
    <div class="sidebar-menu">
      <a class="active" href="student_course.html">我的课程</a>
      <a href="student_score.html">我的成绩</a>
      <a href="student_chooseCourse.html">选课</a>
      <a href="student_deleteCourse.html">退课</a>
    </div>
    <div class="sidebar-logout">退出登录</div>
  </nav>
  <div class="main">
    <div class="header">
      <span class="header-title">学生成绩管理系统</span>
      <span class="header-user" id="username"></span>
    </div>
    <div class="content">
      <div class="decoration-yellow"></div>
      <div class="decoration-red"></div>
      <div class="decoration-green"></div>
      
      <div class="card">
        <table class="table">
          <thead>
          <tr>
            <th>课程号</th><th>课程名</th><th>教师名</th><th>学时</th><th>地点</th>
          </tr>
          </thead>
          <tbody>

          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>

<script>
  let currentCourseId = null, currentRow = null;

  // 关闭弹窗
  function closeDeleteConfirmModal() {
    document.getElementById('deleteConfirmModal').style.display = 'none';
    currentCourseId = null;
    currentRow = null;
  }

  // 等待 DOM 加载完成后再执行脚本
  document.addEventListener("DOMContentLoaded", function () {
    // 获取表格的 tbody 元素
    const tableBody = document.querySelector(".table");

    // 向后端发起 GET 请求
   fetch("/student/selections/{studentId}") // 替换为实际的学生数据接口路径
            .then(response => response.json()) // 解析响应为 JSON
            .then(data => {
              // 遍历返回的 JSON 数据
              data.forEach(course => {
                // 创建一个新的 tr 元素
                const row = document.createElement("tr");

                // 插入学生信息到表格行中
                row.innerHTML = `
                    <td>${course.Cno}</td>
                    <td>${course.Cname}</td>
                    <td>${course.tname}</td>
                    <td>${course.Chours}</td>
                    <td>${course.coursePlace}</td>
                `;

                // 将行添加到表格中
                tableBody.appendChild(row);
              });
            })

            .catch(error => {
              console.error(error);
            });
  });

  document.addEventListener('DOMContentLoaded', function () {
  fetch('/student/{user_id}')
    .then(res => res.json())
    .then(user => {
      // 假如后端返回 Sname 字段
      document.getElementById('username').textContent = user.Sname + "【学生】";
    })
    .catch(() => {
      document.getElementById('username').textContent = "未登录【学生】";
    });
});
</script>
</body>
</html>